<template>
  <div class="movieList">
    <div class="title">
        <div class="title-1">正在热映(8)部</div>
        <div>查询更多</div>
    </div>
    <div class="content">
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
        <MovieItem></MovieItem>
    </div>
  </div>
</template>

<script>
import MovieItem from "@/components/movies/MovieItem.vue";
export default {
  components: {
    MovieItem,
  },
};
</script>

<style lang="scss">
.movieList {
  display: flex;
  flex-wrap: wrap;
  width: 750px;
  height: 616px;
  .title{
    display: flex;
    width: 750px;
    height: 70px;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    .title-1{
        font-size: 24px;
        color: orange;
    }
  }
  .content{
    display: flex;
    width: 100%;
    flex: 1;
    flex-wrap: wrap;


  }
}
</style>